import {
  getToken,
  setToken,
  removeToken,
  getTimeStamp,
  setTimeStamp
} from '@/utils/auth.js'
import { login, getUserInfo, getUserDetailById } from '@/api/user'
import { resetRouter } from '@/router'
// 状态
// 初始化时从缓存中读取状态,并赋值到初始化的状态上
// Vuex的持久化 如何实现 ? Vuex和前端缓存相结合
const state = {
  token: getToken(), //设置token为共享状态
  userInfo: {} //定义一个空对象 不能定义为null
}
// 修改状态
const mutations = {
  setToken(state, token) {
    state.token = token //将数据设置给vue
    // 同步给缓存
    setToken(token)
  },
  removeToken(state) {
    state.token = null
    removeToken()
  },
  // 得到用户资料
  setUserInfo(state, data) {
    state.userInfo = data
  },
  // 删除用户资料
  removeUserInfo(state) {
    state.userInfo = {}
  }
}
//执行异步
const actions = {
  // 实现登录
  async login(context, data) {
    // 调用api接口
    const result = await login(data)
    // axios 默认给数据加了一层data,但在响应拦截器已经解构过了
    context.commit('setToken', result)
    //设置当前时间戳
    setTimeStamp()
  },
  // 获取用户资料
  async getUserInfo(context) {
    const result = await getUserInfo()
    console.log(result)
    // 用来获取头像
    const baseInfo = await getUserDetailById(result.userId)
    // 两个数据合并
    const obj = {
      ...result,
      ...baseInfo
    }
    context.commit('setUserInfo', obj)
    return result //后期做权限用的
  },
  // 登出功能
  logout(context) {
    //删除token
    context.commit('removeToken')
    //删除用户资料
    context.commit('removeUserInfo')
    // 重置路由
    resetRouter()
    // 设置权限模块下 路由为初始状态
    // 要清空permission模块下的state数据
    // vuex中 user子模块  permission子模块
    // 子模块调用子模块的action  默认情况下 子模块的context是子模块的
    // 父模块 调用 子模块的action
    context.commit('permission/setRoutes', [], {
      root: true
    })
    /* 子模块调用子模块的action 可以 将 commit的第三个参数 设置成  { root: true } 
    就表示当前的context不是子模块了 而是父模块*/
  }
}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}
